import { useDataMapping, useDigital, useLocale } from "@/hooks"

// Defining the interface based on the Vue table columns
export interface TableData {
	createDt: string
	lastLoginTime: string
	lastBetTime: string
	deviceType: string
	registerIp: string
	ipAttribution: string
	parentProxyName: string
	userName: string
	realName: string
	nickName: string
	merchantName: string
	loginLockStatus: number
	gameLockStatus: number
	paymentLockStatus: number
	labelName: string
	remark: string
	bankCardNum: number
	virtualNum: number
	operator: string
	eventTime: string
	operatorRemark: string
	imageAddress: string
	adjustType: number
	validMultiple: number
	adjustAmount: number
	currency: string
}

const memberTopupReviewRecordDetail = () => {
	const { newFormat } = useLocale()
	const { renderFormat } = useDigital()
	const { getFromDic } = useDataMapping()

	const memberTopupReviewRecordDetail_createDt = {
		title: "funds.fund_audit.register_time",
		width: 160
	}
	const memberTopupReviewRecordDetail_lastLoginTime = {
		title: "funds.fund_audit.last_login_datetime",
		width: 160
	}
	const memberTopupReviewRecordDetail_lastBetTime = {
		title: "funds.fund_audit.last_bet_time",
		width: 160
	}
	const memberTopupReviewRecordDetail_deviceType = {
		title: "funds.fund_audit.registry_app_type",
		width: 100,
		render: getFromDic("deviceType", false)
	}
	const memberTopupReviewRecordDetail_registerIp = {
		title: "funds.fund_audit.register_ip",
		width: 130
	}
	const memberTopupReviewRecordDetail_ipAttribution = {
		title: "funds.fund_audit.ip_attribution",
		width: 130
	}
	const memberTopupReviewRecordDetail_parentProxyName = {
		title: "funds.fund_audit.parent_proxy_name",
		width: 120
	}
	const memberTopupReviewRecordDetail_userName = {
		title: "funds.user_name",
		width: 160
	}
	const memberTopupReviewRecordDetail_realName = {
		title: "funds.fund_audit.real_name",
		width: 160
	}
	const memberTopupReviewRecordDetail_nickName = {
		title: "funds.capital_adjustment.member_nickname",
		width: 160
	}
	const memberTopupReviewRecordDetail_merchantName = {
		title: "common.belong_merchant",
		width: 160
	}
	const memberTopupReviewRecordDetail_accountStatus = {
		title: "common.account_status",
		width: 160,
		render: (_: any, record: TableData) => {
			return (
				<>
					{record.loginLockStatus === 1 && <span className="disableRgba">{newFormat("common.login_lock_status")}</span>}
					{record.paymentLockStatus === 1 && <span className="deleteRgba">{newFormat("common.account_lock_status")}</span>}
					{record.gameLockStatus === 1 && <span className="lockingRgba">{newFormat("common.game_lock_status")}</span>}
					{record.loginLockStatus === 0 && record.paymentLockStatus === 0 && record.gameLockStatus === 0 && (
						<span className="normalRgba">{newFormat("common.account_status_normal")}</span>
					)}
				</>
			)
		}
	}
	const memberTopupReviewRecordDetail_labelName = {
		title: "funds.fund_audit.label_name",
		width: 160
	}
	const memberTopupReviewRecordDetail_remark = {
		title: "common.remark",
		width: 160
	}
	const memberTopupReviewRecordDetail_bankCardNum = {
		title: "funds.fund_audit.bind_bank_card_count",
		width: 160,
		render: (v: number) => (v || v === 0 ? v : "-")
	}
	const memberTopupReviewRecordDetail_virtualNum = {
		title: "funds.fund_audit.bind_virtual_count",
		width: 160,
		render: (v: number) => (v || v === 0 ? v : "-")
	}
	const memberTopupReviewRecordDetail_operator = {
		title: "funds.fund_audit.operator",
		width: 160
	}
	const memberTopupReviewRecordDetail_eventTime = {
		title: "funds.apply_time",
		width: 160
	}
	const memberTopupReviewRecordDetail_operatorRemark = {
		title: "funds.fund_audit.operator_remark",
		width: 160
	}
	const memberTopupReviewRecordDetail_imageAddress = {
		title: "funds.fund_audit.image_address",
		width: 160
	}
	const memberTopupReviewRecordDetail_adjustType = {
		title: "funds.fund_audit.adjust_type",
		width: 160,
		render: getFromDic("memberPatchAddAdjustType", false)
	}
	const memberTopupReviewRecordDetail_validMultiple = {
		title: "funds.fund_audit.valid_multiple1",
		width: 160,
		render: (v: number) => (v || v === 0 ? v : "-")
	}
	const memberTopupReviewRecordDetail_adjustAmount = {
		title: "funds.fund_audit.order_amount",
		width: 160,
		render: (v: number) => <span style={{ color: "red", fontWeight: 600 }}>{renderFormat(v)}</span>
	}

	return {
		memberTopupReviewRecordDetail_createDt,
		memberTopupReviewRecordDetail_lastLoginTime,
		memberTopupReviewRecordDetail_lastBetTime,
		memberTopupReviewRecordDetail_deviceType,
		memberTopupReviewRecordDetail_registerIp,
		memberTopupReviewRecordDetail_ipAttribution,
		memberTopupReviewRecordDetail_parentProxyName,
		memberTopupReviewRecordDetail_userName,
		memberTopupReviewRecordDetail_realName,
		memberTopupReviewRecordDetail_nickName,
		memberTopupReviewRecordDetail_merchantName,
		memberTopupReviewRecordDetail_accountStatus,
		memberTopupReviewRecordDetail_labelName,
		memberTopupReviewRecordDetail_remark,
		memberTopupReviewRecordDetail_bankCardNum,
		memberTopupReviewRecordDetail_virtualNum,
		memberTopupReviewRecordDetail_operator,
		memberTopupReviewRecordDetail_eventTime,
		memberTopupReviewRecordDetail_operatorRemark,
		memberTopupReviewRecordDetail_imageAddress,
		memberTopupReviewRecordDetail_adjustType,
		memberTopupReviewRecordDetail_validMultiple,
		memberTopupReviewRecordDetail_adjustAmount
	}
}

export default memberTopupReviewRecordDetail
